<template>
	<div id="school_recharge">
		<div class="content-recharge">
			<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="250px" class="recharge-ruleForm">
				<el-form-item label="充值学员" >
					<span style="font-size:0.16rem;">{{student.realName}}</span>
				</el-form-item>
				<el-form-item label="充值卡" prop="studentCardId">
					<el-select style="width:3rem;" v-model="ruleForm.studentCardId"
					 placeholder="请选择充值卡" @change="selectCardChange">
						<el-option
							v-for="item in VipCardList"
							:key="item.studentCardId"
							:label="item.studentCardName"
							:value="item.studentCardId">
						</el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="充值金额" prop="rechargeMoney">
					<el-input style="width:3rem;" disabled v-model.number="ruleForm.rechargeMoney" autocomplete="off"></el-input>
				</el-form-item>
				<el-form-item label="权益开始" prop="effectiveDate">
					<el-date-picker
						v-model="ruleForm.effectiveDate"
						type="date"
						value-format="yyyy-MM-dd HH:mm:ss"
						:picker-options="pickerOptions"
						placeholder="选择日期权益开始">
					</el-date-picker>
				</el-form-item>
				<el-form-item label="选择充值方式" prop="accountPayMode">
					<el-select style="width:3rem;" v-model="ruleForm.accountPayMode" placeholder="请选择方式">
						<el-option
							v-for="item in account_pay_mode"
							:key="item.value"
							:label="item.name"
							:value="item.value">
						</el-option>
					</el-select>
				</el-form-item>
				<el-form-item>
					<el-button class="resetElement" style="margin-left: 0.3rem;" @click="resetForm('ruleForm')">取消</el-button>
					<el-button class="resetElement" type="primary" @click="submitForm('ruleForm')">确定</el-button>
				</el-form-item>
			</el-form>
		</div>
	</div>
</template>

<script>
	import getVipCardEndDate from '@keer/js/vip_manage/vip_card_date.js'
	let vm;
	export default{
		components:{},
		props:['schoolRecharge'],
		data(){
			var checkMoney = (rule, value, callback) => {
				if (value <= 0) {
					callback(new Error('金额必须大于0'));
				} 
				else if(value>100000000) {
					callback(new Error('金额必须小于100000000'));
				}
				else{
					callback();
				}
			};
			return {
				student:{},
				ruleForm: {
					studentCardId: '',
					cardDateType:'',
					rechargeMoney: '',
					effectiveDate:'',
					accountPayMode: '',
				},
				rules: {
					studentCardId: [
						{ required: true, message: '请选择充值卡类型', trigger: 'change' }
					],
					rechargeMoney: [
						{ required: true, message: '请输入充值金额', trigger: 'blur' },
						{ type:'number', message: '充值金额必须为数字', trigger: 'blur' },
						{ validator: checkMoney, trigger: 'blur' }
					],
					effectiveDate: [
						{ required: true, message: '请选择权益开始日期', trigger: 'change' }
					],
					accountPayMode: [
						{ required: true, message: '请选择充值方式', trigger: 'change' }
					]
				},
				account_pay_mode:[],
				VipCardList:[],
				//日期有效性计算
				pickerOptions : {
					disabledDate : function(date) {
						let select = tool.DateToString(date,"yyyy-MM-dd");
						let now = tool.DateToString(new Date(),"yyyy-MM-dd");
						return ((select>=now)? false : true);
					}
				},
			};
		},
		methods:{
			initByData(student){
				this.$refs['ruleForm'].resetFields();
				this.student=student;
				this.getVipCardList();
			},
			/**获取会员卡列表 */
			getVipCardList(){
				api.vipCardList({
					campusId:this.$store.state.campusId
				}).then(function(data){
					if(data.resultCode==2000){
						vm.VipCardList=data.list;
					}
				});
			},
			/**提交表单 */
			submitForm(formName) {
				this.$refs[formName].validate((valid) => {
					if (valid) {
						let time=getVipCardEndDate(vm.ruleForm.effectiveDate,vm.ruleForm.cardDateType);
						api.vipCheckReCharge({
							campusId:this.$store.state.campusId,
							clueId:this.student.clueId,
							rechargeMoney:this.ruleForm.rechargeMoney,
							studentCardId:this.ruleForm.studentCardId,
							effectiveDate:this.ruleForm.effectiveDate,
							effectiveDateEnd:time.end,
							accountPayMode:this.ruleForm.accountPayMode,
							_wait:''
						}).then(function(d){
							if(d.resultCode==2000){
								if(d.result>0){
									vm.$confirm("您已充值过该权益有效期内的会员卡，是否继续充值？",
									 "温馨提示", {
										confirmButtonText: "确定",
										cancelButtonText: "取消",
										type: "warning",
										center: true
									})
									.then(() => {
										vm.chargeForStudent(time.end);
									})
									.catch(() => {});
								}
								else
									vm.chargeForStudent(time.end);
							}
							else{
								vm.$message({
									message: d.message||'操作失败！',
									type: 'warning'
								});
							}
						});
						
					} else {
						return false;
					}
				});
			},
			/**充值 */
			chargeForStudent(effectiveDateEnd){
				api.vipReCharge({
					campusId:vm.$store.state.campusId,
					clueId:vm.student.clueId,
					rechargeMoney:vm.ruleForm.rechargeMoney,
					studentCardId:vm.ruleForm.studentCardId,
					effectiveDate:vm.ruleForm.effectiveDate,
					effectiveDateEnd:effectiveDateEnd,
					accountPayMode:vm.ruleForm.accountPayMode,
					_wait:''
				}).then(function(d){
					if(d.resultCode==2000){
						vm.$emit('chargeOk',null);
						vm.$message({
							message: '充值成功！',
							type: 'success'
						});
						
					}
					else{
						vm.$message({
							message: d.message||'操作失败！',
							type: 'warning'
						});
					}
				});
			},
			/**重置 */
			resetForm(formName) {
				this.$refs[formName].resetFields();
				this.$emit('cancel',null);
			},
			/**选择卡片 */
			selectCardChange(val){
				vm.VipCardList.forEach(row=>{
					if(row.studentCardId==val){
						vm.ruleForm.cardDateType=row.cardDateType;
						vm.ruleForm.rechargeMoney=row.cardMoney;
					}
				})
				
			},
		},
		mounted(){
			this.account_pay_mode=tool.getDictNameByValue(-100,'account_pay_mode');
			
			vm=this;
		},
		computed:{
			
		},
		watch:{

		}
	}
</script>

<style lang="scss">
	#school_recharge{
		color: #333333;
		.content-recharge{
			.row{
				width: 100%;
				min-height: 0.16rem;
				margin: 0.08rem 0;
			}
			.el-form-item__label{
				font-size: 0.16rem !important;
			}
		}
		

		//鼠标悬浮
		.hoverpointer:hover{
			cursor: pointer;
		}
		// 滚动条
		.scrollbarstyle::-webkit-scrollbar {
			width: 0.05rem;
		}
		.scrollbarstyle::-webkit-scrollbar-thumb {
			border-radius: 0.5rem;
			background: #BBBBBB;
		}
		.scrollbarstyle::-webkit-scrollbar-track {
			background: #F2F6FC;
		}
		.el-table__body-wrapper::-webkit-scrollbar {
			width: 0.05rem;
		}
		.el-table__body-wrapper::-webkit-scrollbar-thumb {
			border-radius: 0.5rem;
			background: #BBBBBB;
		}
		.el-table__body-wrapper::-webkit-scrollbar-track {
			background: #F2F6FC;
		}
	}
	.schoolRechargePopup{
		.el-dialog{
			width: 8rem !important;
		}
	}
</style>